<template>
    <view>
        <!-- pages/ucenter/order.wxml -->

        <view class="order">
            <scroll-view class="order" :scroll-x="true" scroll-with-animation :scroll-left="initleft" :enhanced="true" @dragend="changescroll">
                <text :class="status == item.id ? 'active' : ''" @tap="changetab" :data-index="item.index" :data-status="item.id" v-for="(item, index) in tabar" :key="index">
                    {{ item.title }}
                </text>
            </scroll-view>
            <!-- <view class="scroll-bar-view" style="left:{{scrollleft}}rpx"></view> -->
        </view>
        <view class="containers">
            <view class="goods" v-for="(item, index) in list" :key="index">
                <view class="shoptitle" @tap="gomsg" :data-id="item.orderid" style="justify-content: space-between">
                    <!-- <image src="/static/dianpu2.png" mode="aspectFit"></image> -->

                    <text>{{ item.formatstatus }}</text>
                    <text>单号：{{ item.orderid }}</text>
                    <!-- <image src="/static/right.png" mode="aspectFit" style="margin-right: 20px"></image> -->
                </view>

                <view class="goodslist" @tap="gomsg" :data-id="item.orderid" v-for="(items, index1) in item.goodslist" :key="items.index1">
                    <image :src="items.thumb" mode="aspectFill"></image>

                    <view class="msgs">
                        <text class="ellipsis-2">{{ items.title }}</text>
                        <text class="guige" v-if="items.memo">{{ items.memo }}</text>
                        <view>
                            <text>X{{ item.num }}</text>
                            <text>
                                合计:
                                <text>￥{{ item.money }}</text>
                            </text>
                        </view>
                    </view>
                </view>

                <view class="btns">
                    <text @tap="cancel" :data-status="item.status" :data-id="item.orderid" v-if="item.status < 2 && item.status > 0 && item.model!='vip'">取消订单</text>
                    <!-- <text v-if="item.status == 0" @tap="gopay" :data-id="item.orderid">付款</text> -->
                    <text v-if="item.status >= 2" @tap="watchwuliu" :data-id="item.orderid">查看物流</text>
                    <text v-if="item.status == 2" @tap="shouhuo" :data-id="item.orderid">确认收货</text>
                    <!-- <text wx:if="{{item.ishexiao}}" catchtap="watch" data-index="{{index}}">查看核销</text> -->
                    <!-- <text wx:if="{{item.status==3&&item.time4==0}}" catchtap="pingjia" data-id="{{item.orderid}}">评价</text> -->
                    <!-- <text v-if="(item.isziti == '0' ? true : false) && item.status > 1 && item.backnum < 3" @tap.stop.prevent="tuihuo" :data-id="item.orderid">售后/退货</text> -->
                    <!-- <text class="active">再来一单</text> -->
                </view>
            </view>
            <image src="/static/Null-data.png" mode="aspectFit" v-if="!list || list.length < 1" class="nodata"></image>
        </view>
        <view class="tan" v-if="ishexiao">
            <view class="shadow" @tap="close"></view>
            <view class="content">
                <image src="/static/close.png" mode="aspectFit" class="close" @tap="close"></image>
                <text class="title">订单核销码</text>
                <text class="desc">{{ info.title }}</text>
                <image :src="info.qrcode" mode="aspectFit"></image>
            </view>
        </view>
    </view>
</template>

<script>
import vanEmpty from '../../components/empty/empty.vue';
export default {
    components: {
        vanEmpty,
    },
    data() {
        return {
            initleft: 0,
            scrollleft: '20',

            tabar: [
                {
                    title: '全部',
                    id: 'all',
                    index: 0
                },
                {
                    title: '待发货',
                    id: '1',
                    index: 1
                },
            
                {
                    title: '待收货',
                    id: '2',
                    index: 2
                },
                {
                    title: '已完成',
                    id: '3',
                    index: 3
                },
                {
                    title: '售后/退货',
                    id: 'back',
                    index: 4
                }
            ],

            tabIndex: '0',
            nextp: 1,
            status: 'all',
            list: '',

            info: {
                title: '',
                qrcode: ''
            },

            ishexiao: 0
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        this.tabIndex = options.status == 'all' ? 0 : Number(options.status) + 1,
        this.status = options.status || 'all',
        this.scrollleft = 125 * (options.status == 'all' ? 0 : Number(options.status) + 1) + 20
        this.init();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {
        if (this.nextp) {
            this.init();
        }
    },
    methods: {
        changetab(e) {
            var index = e.currentTarget.dataset.index;
            var status = e.currentTarget.dataset.status;
            this.tabIndex= index,
            this.status= status,
            this.scrollleft= 125 * index + 20,
            this.nextp= 1
            this.init();
        },

        init() {
            var _this = this;

            _this.$http(
                'center/orderlist',
                {
                    p: _this.nextp,
                    status: _this.status
                },
                function (res) {
                    if (res.code === 0) {
                    
                        if (_this.nextp == 1) {
                           
                            _this.list = res.data.list,
                            _this.nextp = res.data.nextp
                        } else {
                            for (var i = 0; i < res.data.list.length; i++) {
                                _this.list.push(res.data.list[i]);
                            }

                        
                        }
                    }
					_this.nextp = res.data.nextp;
				}
            );
        },

        gomsg(e) {
            // var orderid = e.currentTarget.dataset.id;
            // wx.navigateTo({
            //   url: '/pages/order/msg?orderid=' + orderid,
            // })
        },

        gopay(e) {
            var orderid = e.currentTarget.dataset.id;
            uni.navigateTo({
                url: '/pages/order/submitorder?orderid=' + orderid
            });
        },

        cancel(e) {
            var _this = this;

            var orderid = e.currentTarget.dataset.id;
            var status = e.currentTarget.dataset.status;
            var content = status > 0 ? '是否要取消该订单？审核通过后资金将原路退还' : '是否要删除该订单';
            uni.showModal({
                title: '取消提示',
                content: content,

                success(isok) {
                    if (isok.confirm) {
                        app.globalData.authPost2(
                            'app/center/unorder',
                            {
                                orderid: orderid,
                                status: _this.status
                            },
                            function (res) {
                                if (res.code === 0) {
                                    uni.showModal({
                                        title: '提示',
                                        content: res.msg,
                                        showCancel: false,

                                        success(res) {
                                            _this.setData({
                                                nextp: 1,
                                                tabIndex: 5
                                            });

                                            _this.init();
                                        }
                                    }); // wx.showToast({
                                    //   title: res.info,
                                    //   icon:'success'
                                    // })
                                }
                            }
                        );
                    }
                }
            });
        },

        watchwuliu(e) {
            var orderid = e.currentTarget.dataset.id;
            uni.navigateTo({
                url: '/pages/order/watchwuliu?orderid=' + orderid
            });
        },

        watch(e) {
            var index = e.currentTarget.dataset.index;
            this.setData({
                info: this.list[index],
                ishexiao: 1
            });
        },

        tuihuo(e) {
            var orderid = e.currentTarget.dataset.id;
            uni.navigateTo({
                url: '/pages/ucenter/tuihuo?orderid=' + orderid
            });
        },

        close() {
            this.setData({
                ishexiao: 0
            });
        },

        shouhuo(e) {
            var _this = this;

            var orderid = e.currentTarget.dataset.id;
            uni.showModal({
                title: '确认收货提示',
                content: '您确定已经收到货并进行收货操作吗？',

                success(isok) {
                    if (isok.confirm) {
                        uni.showLoading({
                            title: '请求中'
                        });
                        app.globalData.authPost2(
                            'app/center/entershouhuo',
                            {
                                orderid: orderid
                            },
                            function (res) {
                                uni.showToast({
                                    title: res.msg,
                                    icon: 'none'
                                });

                                if (res.code === 0) {
                                    uni.hideLoading({
                                        success: (res) => {}
                                    });

                                    _this.setData({
                                        tabIndex: 4,
                                        nextp: 1
                                    });

                                    _this.init();
                                } else {
                                    uni.hideLoading({
                                        success: (res) => {}
                                    });
                                }
                            }
                        );
                    }
                }
            });
        },

        pingjia(e) {
            var _this = this;

            var orderid = e.currentTarget.dataset.id;
            uni.navigateTo({
                url: '/pages/ucenter/addpingjia?orderid=' + orderid
            });
        },

        changescroll() {
            console.log('占位：函数 changescroll 未声明');
        }
    }
};
</script>
<style lang="scss"> 
@import './list.scss';
</style>
